import {Navigator, PixelRatio, Platform, StatusBar, StyleSheet} from "react-native";

const Dimensions = require('Dimensions');
const {width, height} = Dimensions.get('window');
const designScreenWidth = 750;
const designScreenHeight = 1334;
const pi = PixelRatio.get();
const fontScale = PixelRatio.getFontScale() / pi;
const statusBarHeight = Platform.OS === 'ios' ? Navigator.NavigationBar.Styles.General.StatusBarHeight : StatusBar.currentHeight;
const openTranslucent = Platform.OS === 'ios' || (Platform.OS === 'android' && Platform.Version >= 21);

const getActualFontSize = function (designFontSize) {
    return designFontSize * height / designScreenHeight / fontScale;
}

const getActualSizeInHorizontal = function (designWidth) {
    return designWidth * width / designScreenWidth;
};
const getActualSizeInVertical = function (designHeight) {
    return designHeight * height / designScreenHeight;
};

headerHeight = getActualSizeInVertical(88);
headerHeight += openTranslucent ? statusBarHeight : 0;

const footerHeight = getActualSizeInVertical(120);

const chjStyle = StyleSheet.create(
    {
        row: {flexDirection: 'row'},
        column: {flexDirection: 'column'},
        center: {justifyContent: 'center'},
        flex1: {flex: 1},

        mainContainer: {
            flex: 1,
        },
        secondaryContainer: {
            position: 'absolute',
            top: 0,
            left: 0,
            width: width,
            height: height - footerHeight,
        },
        mainUIHeader: {
            position: 'absolute',
            top: 0,
            left: 0,
            width: width,
            height: headerHeight,
            backgroundColor: '#303030',
        },
        mainUIFooter: {
            width: width,
            height: footerHeight,
            flexDirection: 'row',
            backgroundColor: '#fff',
            justifyContent: 'space-around',
            borderTopWidth: 1 / pi,
            borderTopColor: '#aaa'
        },
        mainList: {
        },
        mainListContainer: {
            alignItems: 'stretch',
        },
        mainUIFooterButton: {
            flexDirection: 'row',
            justifyContent: 'center',
        },
        topButtonLeft: {
            position: 'absolute',
            borderTopWidth: 1,
            borderLeftWidth: 1,
            borderRightWidth: 1,
            borderBottomWidth: 1,
            borderColor: '#f91',

            // borderTopLeftRadius: getActualSizeInVertical(15),
            // borderBottomLeftRadius:getActualSizeInVertical(15),
            left: getActualSizeInHorizontal(225),
            top: getActualSizeInVertical(70),
            width: getActualSizeInHorizontal(150),
            height: getActualSizeInVertical(60),
        },
        topButtonRight: {
            position: 'absolute',
            left: getActualSizeInHorizontal(375),
            top: getActualSizeInVertical(70),
            width: getActualSizeInHorizontal(150),
            height: getActualSizeInVertical(60),
        },
        menuButton: {
            position: 'absolute',
            left: width - getActualSizeInHorizontal(70),
            top: getActualSizeInVertical(70),
            width: getActualSizeInHorizontal(150),
            height: getActualSizeInVertical(60),
        },

        auctionItemStyle: {
            height: getActualSizeInVertical(450),
            backgroundColor: '#ffffff',
            borderTopWidth: getActualSizeInVertical(15),
            borderTopColor: '#e0e0e0',
            borderBottomWidth: getActualSizeInVertical(15),
            borderBottomColor: '#e0e0e0',
            borderLeftWidth: getActualSizeInHorizontal(30),
            borderLeftColor: '#e0e0e0',
            borderRightWidth: getActualSizeInHorizontal(30),
            borderRightColor: '#e0e0e0'
        },

        imageStyle01: {
            position: 'absolute',
            left: getActualSizeInHorizontal(0),
            top: getActualSizeInVertical(0),
            width: getActualSizeInHorizontal(690),
            height: getActualSizeInVertical(300),
        },

        auctionItemBarBg: {
            position: 'absolute',
            width: getActualSizeInHorizontal(690),
            height: getActualSizeInVertical(60),
            left: getActualSizeInHorizontal(0),
            top: getActualSizeInVertical(240),
        },

        auctionItemTextName: {
            position: 'absolute',
            color: '#ffffff',
            textAlign: 'left',
            backgroundColor: 'rgba(100, 100, 100, 0)',
            fontSize: getActualFontSize(24),
            width: getActualSizeInHorizontal(600),
            height: getActualSizeInVertical(32),
            left: getActualSizeInHorizontal(20),
            top: getActualSizeInVertical(252),
        },

        auctionItemAuctionTimeText: {
            position: 'absolute',
            color: '#555555',
            textAlign: 'left',
            backgroundColor: 'rgba(100, 100, 100, 0)',
            fontSize: getActualFontSize(24),
            width: getActualSizeInHorizontal(120),
            height: getActualSizeInVertical(32),
            left: getActualSizeInHorizontal(20),
            top: getActualSizeInVertical(312),
        },

        auctionItemAuctionTimeValueText: {
            position: 'absolute',
            color: '#ff971d',
            textAlign: 'left',
            backgroundColor: 'rgba(100, 100, 100, 0)',
            fontSize: getActualSizeInHorizontal(36),
            width: getActualSizeInHorizontal(300),
            height: getActualSizeInVertical(44),
            left: getActualSizeInHorizontal(135),
            top: getActualSizeInVertical(302),
        },

        auctionItemAuctionTimeEndText: {
            position: 'absolute',
            color: '#aaaaaa',
            textAlign: 'left',
            backgroundColor: 'rgba(100, 100, 100, 0)',
            fontSize: getActualFontSize(20),
            width: getActualSizeInHorizontal(300),
            height: getActualSizeInVertical(28),
            left: getActualSizeInHorizontal(20),
            top: getActualSizeInVertical(362),
        },

        auctionItemAuctionTimeEndValueText: {
            position: 'absolute',
            color: '#ffffff',
            backgroundColor: '#ff971d',
            textAlign: 'center',
            textAlignVertical: 'center',
            fontSize: getActualFontSize(20),
            width: getActualSizeInHorizontal(34),
            height: getActualSizeInVertical(34),
            top: getActualSizeInVertical(361),
        },

        auctionItemAuctionTimeEndIntervalText: {
            position: 'absolute',
            color: '#000000',
            textAlign: 'center',
            textAlignVertical: 'center',
            backgroundColor: 'rgba(100, 100, 100, 0)',
            fontSize: getActualFontSize(20),
            width: getActualSizeInHorizontal(34),
            height: getActualSizeInVertical(34),
            top: getActualSizeInVertical(361),
        },
        // module styles
        textItem: {
            // position:'absolute',
            backgroundColor: 'rgba(255, 255, 255, 255)',
            width: getActualSizeInHorizontal(designScreenWidth),
            height: getActualSizeInVertical(128),
            borderBottomWidth: 1 / pi,
            borderBottomColor: '#dddddd'
        },
        textItemText: {
            position: 'absolute',
            color: '#000000',
            backgroundColor: 'rgba(0, 0, 0, 0)',
            fontSize: getActualFontSize(32),
            left: getActualSizeInHorizontal(128),
            top: getActualSizeInVertical(47),
        },
        textItemIcon: {
            position: 'absolute',
            resizeMode: 'contain',
            backgroundColor: 'rgba(0, 0, 0, 0)',
            left: getActualSizeInHorizontal(32),
            top: getActualSizeInVertical(32),
            width: getActualSizeInHorizontal(64),
            height: getActualSizeInVertical(64),
        },

        // header style
        headerContainer: {
            width: width,
            height: headerHeight,
            backgroundColor: '#FFC000',
            flexDirection: 'row',
            alignItems: 'center'
        },
        headerLeftButton: {
            backgroundColor: 'rgba(0, 0, 0, 0)',
            left: getActualSizeInHorizontal(30),
        },
        headerRightButton: {
            backgroundColor: 'rgba(0, 0, 0, 0)',
            right: getActualSizeInHorizontal(30),

        },
        headerTitle: {
            color: '#fff',
            textAlign: 'center',
            backgroundColor: 'rgba(0, 0, 0, 0)',
            fontSize: getActualFontSize(38),
            flex: 1
        },

        // 车辆录入界面内容容器
        recordContainer: {
        },

        // 弹出框样式
        dialogContainer: {
            position: 'absolute',
            top: height / 4,
            left: 0,
            width: width,
            height: height / 2,
        },

        // 车辆列表界面item
        carListItem: {
            // position:'absolute',
            backgroundColor: 'rgba(255, 255, 255, 255)',
            width: getActualSizeInHorizontal(designScreenWidth),
            height: getActualSizeInVertical(292),
            borderBottomWidth: 1,
            borderBottomColor: '#dddddd'
        },

        // Text基本格式
        baseText: {
            backgroundColor: 'rgba(0, 0, 0, 0)', // 在iOS上，缺少这个属性有时候会有显示问题
            includeFontPadding: false, // 在Android上，缺少这个属性，会导致文字的位置有问题
            paddingTop: 0,
            paddingBottom: 0,//取消默认的padding值
        },
    }
);

chjStyle.width = width;
chjStyle.height = height;
chjStyle.statusBarHeight = statusBarHeight;
chjStyle.headerHeight = headerHeight;
chjStyle.footerHeight = footerHeight;
chjStyle.getActualSizeInHorizontal = getActualSizeInHorizontal;
chjStyle.getActualSizeInVertical = getActualSizeInVertical;
chjStyle.getActualFontSize = getActualFontSize;
chjStyle.pi = pi;
chjStyle.openTranslucent = openTranslucent;

module.exports = chjStyle;
